<template>
  <view class="StuProfile">
    <view class="text-black text-sm padding-sm">{{ !isFilledData ? '请认真填写资料，以作报名使用' : '如需修改，请认真填写后提交' }}</view>
    <cu-form ref="profileForm">

      <view class="form-group">
        <cu-input name="STUDENTNAME" title="真实姓名" required placeholder="请输入真实姓名"/>
      </view>

      <view class="form-group">
        <cu-input type="number" name="STUDENTNO" title="学号" placeholder="请输入学号(新生无需填写)"/>
      </view>

      <view class="form-group">
				<cu-picker required name="ZZTYPE_ID" title="证件类型" :options="ZZTypeOpts" @change="onZZChange"/>
			</view>

      <view class="form-group">
        <cu-input :type="SFZNO_TYPE" name="SFZNO" title="证件号" required placeholder="请输入证件号"/>
      </view>

      <view class="form-group">
        <cu-input maxlength="11" type="number" name="PHONENO" title="联系电话" required placeholder="请输入联系电话"/>
      </view>

      <view class="form-group">
        <cu-input name="ADDR" title="现住址" required placeholder="请输入现住址"/>
      </view>

      <view class="form-group">
        <cu-radio required name="SEX" title="性别" :options="sexOpt"/>
      </view>

      <view class="margin"></view>

      <view class="form-group">
        <cu-input name="LXR" title="紧急联系人" required placeholder="请输入紧急联系人姓名"/>
      </view>

      <view class="form-group">
        <cu-input type="number" name="LXR_PHONENO" title="紧急联系人电话" required placeholder="请输入紧急联系人电话"/>
      </view>

      <view class="margin"></view>

      <view class="form-group">
        <cu-picker name="ZZMM" title="政治面貌" required :options="ZZMMOpts"/>
      </view>

      <view class="form-group">
        <cu-picker name="WHCD" title="文化程度" required :options="WHCDOpts"/>
      </view>

      <view class="margin"></view>

      <view class="form-group">
        <cu-input name="YDW" title="原单位" placeholder="请输入原单位"/>
      </view>

      <view class="form-group">
        <cu-input name="YZW" title="原职位" placeholder="请输入原职位"/>
      </view>

      <view class="margin"></view>

      <view class="form-group">
        <cu-uploader ref="uploader" name="PICID" compress="true" required title="个人照片上传"/>
      </view>

      <view class="padding">
        <button @tap="onSubmitProfile" class="cu-btn bg-blue block lg round shadow margin-top-lg">保存提交</button>
      </view>
    </cu-form>
  </view>
</template>

<script lang="ts" setup>
import {useLogin} from "../account/useLogin";
import {onBeforeUnmount, onMounted, ref} from "vue";
import CuInput from '../../components/cu-input/index.vue'
import CuRadio from '../../components/cu-radio/index.vue'
import CuPicker from '../../components/cu-picker/index.vue'
import CuForm from '../../components/cu-form/index.vue'
import CuUploader from '../../components/cu-uploader/index.vue'
import {useProfileArgs} from "./useProfileArgs";
import {useZZTypesList} from "./useZZTypesList";
import {getUserData, modifyStudentZZData} from "../../api/manage";
import {useStore} from "vuex";
const {isFilledData} = useLogin()
const {CUSER_ID, USERNO,USERNAME} = useStore().state.user.userInfo
const {commit, state} = useStore()
const profileForm = ref<any>(null)
const SFZNO_TYPE = ref("text")
const {ZZMMOpts, WHCDOpts, sexOpt} = useProfileArgs([
  {
    CSNAME: '政治面貌',
    key: 'ZZMMOpts'
  },
  {
    CSNAME: '文化程度',
    key: 'WHCDOpts'
  },
  {
    CSNAME: '性别',
    key: 'sexOpt'
  }
]).opts

const {ZZTypeOpts} = useZZTypesList()

const uploader = ref<any>(null)

onMounted(() => {
  // profileForm.value.setFields([
  //   {
  //     name: 'ZZMM',
  //     value: '14'
  //   },
  //   {
  //     name: 'STUDENTNAME',
  //     value: 'huntwolf'
  //   },
  //   {
  //     name: 'SEX',
  //     value: '13'
  //   },
  //   {
  //     name: 'WHCD',
  //     value: '11'
  //   },
  //   {
  //     name: 'PICID',
  //     value: 'ZP_2022071302210046_1573.jpg'
  //   }
  // ])
  if (!isFilledData.value){
    uni.setNavigationBarTitle({
      title: '完善个人资料'
    })
  }

  getUserData(CUSER_ID).then(res => {
    if (res.ERROR[0].errcode == '0'){
      if (res.DAT.length > 0){
        profileForm.value.setFields(['STUDENTNAME','STUDENTNO','PICID','ZZTYPE_ID','SFZNO','ADDR','PHONENO','LXR','LXR_PHONENO','ZZMM','WHCD','YDW','YZW'].map(name => ({
          value: res.DAT[0][name] || '',
          name
        })))
        setSFZNOType(res.DAT[0]['ZZTYPE_ID']);
        profileForm.value.setFields([
          {
            value: res.DAT[0]['SEX'] || sexOpt[0].value,
            name: 'SEX'
          }
        ])
      }
    }else {
      uni.showToast({
        title: res.ERROR[0].error,
        icon: 'none',
        mask: true
      })

    }
  }).catch(err => {
    uni.showToast({
      title: '获取资料失败',
      icon: 'error',
      mask: true
    })
    // setTimeout(() => {
    //   uni.navigateBack()
    // },500)
  })
})

onBeforeUnmount(() => {
  uploader.value?.doDelImg()
})

async function onSubmitProfile(){
  (profileForm.value.submit() as Promise<any>).then(async (values) => {
    const PICID = await uploader.value.upload();
    const {STUDENTNAME,STUDENTNO,ZZTYPE_ID,SFZNO,SEX,ADDR,PHONENO,LXR,LXR_PHONENO,ZZMM,WHCD,YDW,YZW} = values
    try {
      const modifyRes = await modifyStudentZZData({
        CUSER_ID,
        USERNO,
        USERNAME,
        STUDENTNO,
        STUDENTNAME,
        PICID,
        ZZTYPE_ID,
        SFZNO,
        SEX,
        ADDR,
        PHONENO,
        LXR,
        LXR_PHONENO,
        ZZMM,
        WHCD,
        YDW,
        YZW,
        OPERATOR_ID: CUSER_ID,
        STATE: 1
      })

      if (modifyRes.ERROR[0].errcode == '0'){
        commit('HAS_FILLED_DATA', true)
        uploader.value.doDelImg()
        uni.showToast({
          title: '提交成功',
          icon: "success",
          mask: true
        })
		commit("SET_USERINFO",true)
        setTimeout(() => {
          uni.navigateBack()
        },500)
      }else {
        uploader.value.doDelImg(true)
        uni.showToast({
          title: modifyRes.ERROR[0].error,
          icon: "none",
          mask: true
        })
      }
    }catch (err){
      uploader.value.doDelImg(true)
      uni.showToast({
        title: '提交失败',
        icon: 'none',
        mask: true
      })
    }
  }).catch(err => {
    uploader.value.doDelImg()
    uni.showToast({
      title: '请完善相关资料后再提交',
      icon: 'none',
      mask: true
    })
  })
}


function onZZChange(e: any){
  setSFZNOType(e);
}

function setSFZNOType(id: any){
  if(id == '2'){
    //港澳通行证
    SFZNO_TYPE.value = "text";
  }else{
    SFZNO_TYPE.value = "idcard";
  }
}

</script>

<style scoped lang="scss">
.StuProfile{
  box-sizing: border-box;
  padding-bottom: constant(safe-area-inset-bottom);  ///兼容 IOS<11.2/
  padding-bottom: env(safe-area-inset-bottom);  ///兼容 IOS>11.2/
  .form-group+.form-group{
    border-top: 1upx solid #eee;
  }

}
</style>
